<template>
	<view>
		<view class="ask_box">
			<block v-for="(item,index) in DataList" :key="index">
				<view class="qa_media_card bdb1" @click="ToUrl('/chat/ask/detail?id=' + item.id )">
					<view>
						<view class="que nowrap-n">
							{{item.title}}
						</view>
						<view class="content">
							<view class="ans_msg">
								<span class="lawyer_name nowrap">{{item.add_time}}</span>
								<view class="num read-number">{{item.view}}人看过</view>
							</view>
						</view>
					</view>
				</view>
			</block>
		</view>
	</view>
</template>

<script>
	import $H from '@/common/js/request.js';
	export default {
		data() {
			return {
				scrollTop: 0,
				TopHeight: uni.getStorageSync('TopHeight'),
				status: 0,
				pages: 1,
				limit: 15,
				page: 0,
				out: 0,
				DataList: [],
				LocalLawyer: [],
				IndexData: {},
			}
		},
		onLoad() {
			this.timeer();
		},
		methods: {
			ToUrl(url) {
				uni.navigateTo({
					url: url
				})
			},
			timeer() {
				this.DataList = [];
				this.isLoading = false;
				this.scroll = false;
				this.status = 0;
				this.pages = 1;
				this.page = 0;
				this.out = 0;
				this.GetData();
			},
			GetData(e) {
				if (this.isLoading) {
					return;
				}
				if (this.page < this.pages) {
					this.out = 0;
					this.isLoading = true;
					this.scroll = false;
					this.status = 1;
					this.limit = 15;
					var page = this.page + 1;
					$H.post('user/asklist', {
						'page': page,
						'limit': this.limit,
					}, {
						token: true
					}).then(res => {
						if (res.code == 1) {
							var list = res.data.data;
							for (let i = 0; i < list.length; i++) {
								//将数据逐条写入数组
								this.DataList.push(list[i]);
							}
							this.pages = res.data.last_page;
							this.page = page;
							this.scroll = true;
							this.isLoading = false;
							setTimeout(() => {
								this.ShowLoading = false
							}, 1000);

							this.out = 1;
							if (this.page == this.pages || res.data.total == 0) {
								this.status = 2;
							} else {
								this.status = 0;
							}
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none',
								duration: 2000
							});
						}
					})
				}
			},
		}

	}
</script>

<style lang="scss" scoped>
	.ask_box {
		padding: 10px;
		margin: 10px;
		background: #fff;
		box-shadow: 0 0.16rem 0.48rem 0 rgba(51, 51, 63, .03);
		border-radius: 8px;
	}

	.qa_media_card {
		padding: 20px 0 20px;
		padding: 10px;
		background: #f8f8f8;
		box-shadow: 0 0.16rem 0.48rem 0 rgba(51, 51, 63, .03);
		border-radius: 8px;
		margin-top: 10px;
	}

	.qa_media_card .que {
		padding-left: 40px;
		font-size: 16px;
		font-weight: 600;
		line-height: 20px;
		color: #111;
		background: url('https://jiangxinsaas.oss-cn-beijing.aliyuncs.com/tuchuang/2017130888200IBHqZ.png') left 5px top 0px no-repeat;
		background-size: 20px 20px;
		margin-bottom: 15px
	}

	.bdb1,
	.bdt1,
	.bdl1,
	.bdr1 {
		position: relative;
		// border-bottom: 1px solid #d8d8d8;
	}

	.nowrap-n {
		// display: -webkit-box;
		// -webkit-box-orient: vertical;
		// overflow: hidden;
		// -webkit-line-clamp: 2;
	}



	.qa_media_card .content {
		border-radius: 8px;
		background: #f5f6f8;
		padding: 15px 0 10px
	}

	.qa_media_card .ans {
		padding-left: 40px;
		font-size: 16px;
		font-weight: 400;
		line-height: 20px;
		color: #666;
		background: url('https://jiangxinsaas.oss-cn-beijing.aliyuncs.com/tuchuang/301713089490NRNG6v.png') left 5px top 0px no-repeat;
		background-size: 20px 20px;
		margin-bottom: 15px
	}

	.qa_media_card .ans_msg {
		display: flex;
		align-items: center;
		// padding: 0 15px 0 10px
	}

	.qa_media_card .lawyer_img {
		width: 20px;
		height: 20px;
		border-radius: 50%;
		margin-right: 10px;
		margin-left: 5px;

		image {
			width: 20px;
			height: 20px;
			border-radius: 50%;
		}
	}

	.qa_media_card .lawyer_name {
		flex: 1;
		overflow: hidden;
		font-size: 14px;
		font-weight: 400;
		color: #111;
		height: 16px;
		line-height: 16px;
	}

	.qa_media_card .num {
		font-size: 12px;
		font-weight: 400;
		color: #999;
		height: 16px;
		line-height: 16px;
		margin-right: 5px;
	}

	.rep {
		background: #fff;
		padding: 10px;
		border-radius: 5px;
		color: #fa3534;
	}
</style>